<template>
  <!-- 页面-新建配置参数-选择值集弹框 -->
  <div style="height:300px" class="selectCompany-page">
    <!-- 搜索区域 -->
    <SelfAdaption>
      <Form
        :model="searchForm"
        ref="searchForm"
        slot="adaption-bar"
        label-position="top"
        class="ivu-form-no-margin-bottom"
        inline
      >
        <Form-item
          v-if="valueType == 1"
          prop="tenantCode"
          :label="$t('module.tenantManage.tenantCode')"
        >
          <Input
            type="text"
            :maxlength="50"
            v-model.trim="searchForm.tenantCode"
            :placeholder="$t('module.tenantManage.entertenantCode')"
            @on-enter="search"
          ></Input>
        </Form-item>
        <Form-item v-if="valueType == 3" prop="userId" :label="$t('module.userManage.account')">
          <Input
            type="text"
            :maxlength="50"
            v-model.trim="searchForm.userId"
            :placeholder="$t('module.userManage.placeholder.account')"
            @on-enter="search"
          ></Input>
        </Form-item>
        <Form-item v-if="valueType == 2" prop="roleCode" :label="$t('module.role.roleCode')">
          <Input
            type="text"
            :maxlength="50"
            v-model.trim="searchForm.roleCode"
            :placeholder="$t('module.role.warning.enterRoleCode')"
            @on-enter="search"
          ></Input>
        </Form-item>
        <Form-item
          v-if="valueType == 1"
          prop="tenantName"
          :label="$t('module.tenantManage.tenantName')"
        >
          <Input
            type="text"
            :maxlength="50"
            v-model.trim="searchForm.tenantName"
            :placeholder="$t('module.tenantManage.entertenantName')"
            @on-enter="search"
          ></Input>
        </Form-item>
        <Form-item v-if="valueType == 3" prop="username" :label="$t('module.userManage.name')">
          <Input
            type="text"
            :maxlength="50"
            v-model.trim="searchForm.username"
            :placeholder="$t('module.userManage.placeholder.userName')"
            @on-enter="search"
          ></Input>
        </Form-item>
        <Form-item v-if="valueType == 2" prop="roleName" :label="$t('module.role.roleName')">
          <Input
            type="text"
            :maxlength="50"
            v-model.trim="searchForm.roleName"
            :placeholder="$t('module.role.warning.enterRoleName')"
            @on-enter="search"
          ></Input>
        </Form-item>

        <!-- 查询\重置按钮 -->
        <Form-item prop="button" class="search-solt-btn">
          <RPButton optType="search" @click="search" />
          <RPButton optType="reset" @click="reset" />
        </Form-item>
      </Form>
    </SelfAdaption>
    <InnerPageTable ref="relectVSTable" :config="pageTableConfig">
      <!-- handler bar 查询/重置-->
      <!--
      <div slot="handle-bar">
        <RPButton optType="search" @click="search" />
        <RPButton optType="reset" @click="reset" />
      </div>
      -->
    </InnerPageTable>
  </div>
</template>
<script>
// import { getCompanyList } from "@/api/orgApi.js";
import { queryRole } from "@/api/roleApi.js";
import userManageAPI from "@/api/userManageApi";
import { getTenantList } from "@/api/teantManageAPI.js";
import locales from "./locales.js";

export default {
  components: {},
  props: {
    value: {
      type: Number,
      default: () => ({})
    }
  },
  name: "selectValueSet",
  mixins: [locales],

  data() {
    return {
      treeTypeList: {},
      productList: {},
      tenantList: {},
      searchForm: {
        // // productCode: "",
        // tenantCode: this.tenantCode,
        // enabled: 1, //enabled:null或不传enabled字段显示所有的公司。为1时为有效公司，0为无效公司。（只要显示有效公司）
        // tenantCode: "", // 公司编码
        // tenantName: "" // 公司名称
      },
      labelCodeContent: "",
      valueType: "",
      labelNameContent: "",
      pageTableConfig: {
        action: null,
        resource: null, //default
        customDataProcess: null, //default
        // loadDataFn: this.type == 1?getTenantList :(this.type == 2?userManageAPI.getUserListPage :this.queryRoleList),
        loadDataFn: null,
        columnsFn: this.generateColumns,
        autoFirst: false, //default false
        highlightRow: true,
        rowClickHandle: this.getRowData
      }
    };
  },
  computed: {},
  created: function() {
    this.valueType = this.value;
    if (this.valueType == 1) {
      this.$emit("SetTitle", this.$t("module.configManage.selectTenant"));
      this.pageTableConfig.loadDataFn = getTenantList;
      this.searchForm = {
        tenantCode: "",
        tenantName: ""
      };
    } else if (this.valueType == 3) {
      this.$emit("SetTitle", this.$t("module.configManage.selectUser"));

      this.pageTableConfig.loadDataFn = userManageAPI.getUserListPage;
      this.searchForm = {
        userId: "",
        username: ""
      };
    } else if (this.valueType == 2) {
      this.$emit("SetTitle", this.$t("module.configManage.selectRole"));

      this.pageTableConfig.loadDataFn = this.queryRoleList;
      this.searchForm = {
        roleName: "",
        roleCode: ""
      };
    }
    this.$emit("SetPageWidth", 866);

    this.init();
  },
  beforeMount: function() {},
  mounted: function() {
    this.search(1);
  },
  beforeDestroy: function() {},
  destroyed: function() {},
  methods: {
    // 获取角色列表数据
    queryRoleList({ responseProcess, param }) {
      queryRole(param).then(data => {
        responseProcess(data);
      });
    },
    // 点击当前行触发
    getRowData() {
      let row = this.$refs["relectVSTable"].getHighlightRow();
      this.$emit("Close", row);
    },
    init() {},

    // 查询
    search(page) {
      this.$refs["relectVSTable"].load(this.searchForm, page);
    },
    // 重置
    reset() {
      this.$refs["searchForm"].resetFields();
      this.search(1);
    },
    // 表格数据
    // loadData({ responseProcess, param }) {
    //   return window.$http
    //     .post(`${window.RPConfig.mgt}/tree/list/page`, param)
    //     .then(response => response.data)
    //     .then(res => responseProcess(res));
    // },
    // 表格的列
    generateColumns() {
      if (this.valueType == 1) {
        return [
          {
            title: this.$t("module.tenantManage.tenantCode"),
            key: "tenantCode",
            align: "left"
          },
          {
            title: this.$t("module.tenantManage.tenantName"),
            key: "tenantName",
            align: "left"
          }
        ];
      } else if (this.valueType == 3) {
        return [
          {
            title: this.$t("module.userManage.account"),
            key: "userId",
            align: "left"
          },
          {
            title: this.$t("module.userManage.name"),
            key: "userName",
            align: "left"
          },
          {
            title: this.$t("module.userManage.tel"),
            key: "mobile",
            align: "left"
          },
          {
            title: this.$t("module.userManage.email"),
            key: "email",
            align: "left"
          }
        ];
      } else if (this.valueType == 2) {
        return [
          {
            title: this.$t("module.role.roleCode"),
            key: "roleCode",
            align: "left"
          },
          {
            title: this.$t("module.role.roleName"),
            key: "roleName",
            align: "left"
          }
        ];
      }
    },
    // 确定
    confirm() {
      // let row = this.$refs["relectVSTable"].getHighlightRow();
      // this.$emit("Close", row);
    }
  },
  watch: {},
  directives: {}
};
</script>
<style lang="less">
.selectCompany-page {
  .inner-table {
    .single-table-con {
      div:nth-child(3) {
        overflow: inherit !important;
      }
    }
  }
}
</style>